<!--
 * @Author: 小陆同学 1361176289@qq.com
 * @Date: 2024-06-25 09:30:44
 * @LastEditors: 小陆同学 1361176289@qq.com
 * @LastEditTime: 2024-08-01 09:15:14
 * @FilePath: \loCode\src\components\xlDridver\index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
	<div class="xldriver" :style="xldriverStyle"></div>
</template>

<script setup>
	import { computed } from "vue";

	const props = defineProps({
		// 横线或者竖线
		type: {
			type: String,
			default: "horizontal",
		},
		// 是否虚线
		dashed: {
			type: Boolean,
			default: false,
		},
	});

	const xldriverStyle = computed(() => {
		return {
			width: props.type === "horizontal" ? "200px" : "1px",
			height: props.type === "horizontal" ? "1px" : "200px",
			borderBottom: props.dashed ? "1px dashed #ccc" : "1px solid #ccc",
			borderRight: props.dashed ? "1px dashed #ccc" : "1px solid #ccc",
			boxSizing: "border-box",
		};
	});
</script>
